Arazzo plugin UI enhancements#2142
Conversation
…sion and playground
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. 🗂️ Base branches to auto review (4)
Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Pull request overview
This PR enhances the Arazzo Designer/Visualizer VS Code experience with improved workflow execution UX (Try with AI), navigation back to the Overview, and quicker access to per-step execution logs, along with updated server messaging and refreshed README demos.
Changes:
- Add “view logs” entry point from executed step nodes and allow forcing the Properties panel’s active tab.
- Add Home navigation from Workflow view back to the Overview panel; rename “Try” → “Try with AI” across UI/CodeLens.
- Refine Arazzo server start/stop user messaging and update extension README content/demos.
Reviewed changes
Copilot reviewed 15 out of 17 changed files in this pull request and generated 7 comments.
Show a summary per file
| File | Description |
|---|---|
| workspaces/arazzo/arazzo-designer-visualizer/src/views/WorkflowView/WorkflowView.tsx | Injects onViewLogs into step nodes; adds forced tab state; adds Home navigation handler. |
| workspaces/arazzo/arazzo-designer-visualizer/src/views/WorkflowView/WorkflowTitleBar.tsx | Adds Home button and renames Try button label to “Try with AI”. |
| workspaces/arazzo/arazzo-designer-visualizer/src/views/WorkflowView/NodePropertiesPanel.tsx | Adds forceTab prop to programmatically switch between Properties/Logs tabs. |
| workspaces/arazzo/arazzo-designer-visualizer/src/views/MCP_Playground/MCPPlayground.tsx | Updates UI strings from “MCP” to “Arazzo” wording. |
| workspaces/arazzo/arazzo-designer-visualizer/src/constants/nodeConstants.ts | Adjusts initial canvas zoom constant. |
| workspaces/arazzo/arazzo-designer-visualizer/src/components/nodes/StepNode/StepNodeWidget.tsx | Adds “view logs” affordance on completed steps. |
| workspaces/arazzo/arazzo-designer-visualizer/src/components/nodes/StepNode/StepNodeModel.ts | Extends step node data model with onViewLogs. |
| workspaces/arazzo/arazzo-designer-rpc-client/src/RpcClient.ts | Adds RPC notification method to request focusing the Overview panel. |
| workspaces/arazzo/arazzo-designer-extension/src/mcp/runWorkflowCodeLens.ts | Updates CodeLens labels to “Try/Retry with AI”. |
| workspaces/arazzo/arazzo-designer-extension/src/mcp/mcpServerRunner.ts | Refines server lifecycle messages; merges server-start + prompt messaging. |
| workspaces/arazzo/arazzo-designer-extension/src/extension.ts | Updates command descriptions/comments related to starting server and CodeLens behavior. |
| workspaces/arazzo/arazzo-designer-extension/src/RPCLayer.ts | Handles new focusOverviewPanel notification and forwards it to the Overview-opening command. |
| workspaces/arazzo/arazzo-designer-extension/package.json | Renames command title to “Start Arazzo Server”. |
| workspaces/arazzo/arazzo-designer-extension/README.md | Rewrites/expands README with updated features and new demos. |
| workspaces/arazzo/arazzo-designer-core/src/state-machine-types.ts | Defines focusOverviewPanel notification type shared between webview and extension. |
Comments suppressed due to low confidence (1)
workspaces/arazzo/arazzo-designer-extension/src/extension.ts:86
- This comment says the CodeLens shows “▶ Try”, but
RunWorkflowCodeLensProvidernow uses “▶ Try with AI” / “↺ Retry with AI”. Please update the comments here (and nearby ones referencing Run/Rerun) to match the actual UI strings to avoid confusion.
// Register the Run-workflow CodeLens provider (shows "▶ Try" when arazzo server is active)
const runCodeLensProvider = new RunWorkflowCodeLensProvider();
context.subscriptions.push(
vscode.languages.registerCodeLensProvider(
{ language: 'arazzo-yaml' },
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| useEffect(() => { | ||
| if (forceTab) { | ||
| setActiveTab(forceTab); | ||
| } | ||
| }, [forceTab]); |
There was a problem hiding this comment.
forceTab currently only affects the active tab when the forceTab prop changes. If a user clicks “view logs” on another step while forceTab is already 'logs', the node-change effect resets activeTab to 'properties' and this effect won’t re-run. Consider applying forceTab whenever the selected node changes as well (e.g., include node?.id in the deps, or fold this into the node-change effect and prefer forceTab).
…into arazzo-extension-OTeL
changes